<div class="module-login">
    <template v-if="isLoading">
        <div class="m-loading-box">
            <loading></loading>
        </div>
    </template>

    <template v-if="isLoading === false">
    <web-box :title="$t('webBoxPCTitle')" :mobileTit="$t('webBoxTitle')">
        <validator :rules="rules" :parent="_self">
            <form class="m-form-page m-form-login" name="form" action="javascript:;">
                <div class="col-row fn-flex">
                    <label class="row-title">{{$t('common.email')}}</label>
                    <input type="text"
                           :placeholder="$t('common.pEmail')"
                           name="email"
                           v-model="form.email"
                           @blur="blurEmail()"
                           class="input">
                    <div class="ui-tip"></div>
                </div>
                <div class="col-row fn-flex">
                    <label class="row-title">{{$t('common.password')}}</label>
                    <input type="password"
                           :placeholder="$t('common.pPass')"
                           v-model="form.password"
                           name="password"
                           autocomplete="off"
                           class="input">
                    <div class="ui-tip"></div>
                </div>
                <div class="col-row" v-if="needImgCode === true">
                    <div class="comp-verify-code img-code">
                        <a href="javascript:;" class="img-code-link">
                            <img :src="imgCodeSrc" @click="changeImgCode()" width="144" height="40">
                        </a>
                    </div>
                    <input type="text"
                           :placeholder="$t('common.pCaptcha')"
                           name="code"
                           maxlength="4"
                           autocomplete="off"
                           v-model="form.code"
                           class="input-left">
                    <div class="ui-tip"></div>
                </div>
<!--                 <div class="col-row fn-flex m-forget-register">
                    <a href="./reset.html" class="link link-reset">{{$t('forgotPass')}}</a>
                </div> -->
                <div class="col-row" style="margin-top: 16px;">
                    <button type="submit"
                            @click="submit()"
                            v-if="isRequesting === false"
                            class="ui-btn  submit-btn">{{$t('common.signIn')}}</button>
                    <button type="submit"
                            disabled
                            v-if="isRequesting === true"
                            class="ui-btn  submit-btn">{{$t('common.waiting')}}...</button>
                </div>
                <div class="col-row fn-flex forget-register">
                    <a href="./reset.html" class="link link-reset">{{$t('forgotPass')}}</a>
                    <span class="text">|</span>
                    <a href="./register.html" class="link link-register">{{$t('common.signUp')}}</a>
                </div>
            </form>
        </validator>
    </web-box>
    </template>
</div>
